<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Password Generator</title>

    <!-- Bootstrap CSS -->
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=XDyP07fxn5LO5welo2zjWiLEvbl3h9x2"></script>

</head>
<body class="bg-light">

    <div>
        <div id="map" style="height: 400px;"></div>
        <br>
        <p id = "addre">位置信息：{{ addresss }}</p>
        <button type="button" onclick="getLocation()">重新定位</button>
        <button type="button" onclick="signup()">签到</button>
    </div>

    <script>
        var map = null;
        var marker = null;
        var addresss = '';

        function initMap() {
            map = new BMap.Map("map");
            map.centerAndZoom(new BMap.Point(116.404, 39.915), 15);
            map.enableScrollWheelZoom();

            marker = new BMap.Marker(new BMap.Point(116.404, 39.915));
            map.addOverlay(marker);

            getLocation();
        }

        function getLocation() {
            var geolocation = new BMap.Geolocation();
            var geocoder = new BMap.Geocoder();

            geolocation.getCurrentPosition(function (position) {
                if (geolocation.getStatus() === BMAP_STATUS_SUCCESS) {
                    var lng = position.point.lng;
                    var lat = position.point.lat;

                    geocoder.getLocation(new BMap.Point(lng, lat), function (result) {
                        if (result) {
                            var address = result.address;

                            console.log('当前位置经度：', lng);
                            console.log('当前位置纬度：', lat);
                            console.log('详细地址：', address);
                            document.getElementById("addre").innerHTML = address
                        } else {
                            console.error('无法获取详细地址信息');
                        }
                    });

                    map.panTo(new BMap.Point(lng, lat));
                    marker.setPosition(new BMap.Point(lng, lat));
                } else {
                    console.error('无法获取定位信息');
                }
            }, { enableHighAccuracy: true });
        }
    </script>

</body>
</html>
